import React from 'react';
import ReactDOM from 'react-dom';
import { Router, Link } from 'react-router';
import { message,Table,Dropdown,Menu,Button,Icon,Popconfirm} from 'antd';
import NavBar from '../common/NavBar';
import ContentBody from '../common/ContentBody';

import api from '../api';
import moment from 'moment';

import {RAISE_STATUS} from "../constants/index";


export default class RaiseLoanTable extends React.Component {
    constructor(props, context){
        super(props, context);
        this.state={
           
        };
    }

    componentWillMount(){
    }
    
    componentWillReceiveProps(nextProps){
        
    }

    // handleMenuClick(record,e){
    //   console.log(e)
    //   switch(e.key){
    //     case "stop":
    //       break;
        
    //     case "confirm":
    //       this.confirmLoan(record)
    //       break;
    //     case "detail":
    //       break
    //     case "tip_refund":
    //       break
    //     case "refund":
    //       break
    //       break
    //   }
    // }

    //确认放款
    async confirmLoan(record){
      let {reloadTable} = this.props;
      let result = await api('/loan/raise/confirm',{id:record.id});
      if(result.cd!=0){
        message.error(result.msg);
        return
      }
      message.success('放款成功')
      reloadTable();
    }
    //终止项目
    async stopLoan(record){
      let {reloadTable} = this.props;
      let result = await api('/loan/raise/stop',{id:record.id});;
      if(result.cd != 0){
        message.error(result.msg);
        return
      }
      message.success('操作成功');
      reloadTable();
    }

    //还款提醒
    async refundTips(record){
      
      let result = await api('/loan/raise/repayTip',{phone:record.phone,projectId:record.id});
      if(result.cd!=0){
        message.error(result.msg);
        return
      }
      message.success('已提醒');
    }

    //隐藏项目
    async hideLoan(record) {
      let {reloadTable} = this.props;
      let result = await api('/loan/raise/hide',{id:record.id,hide_flag:record.hide_flag});
      if(result.cd!=0){
        message.error(result.msg);
        return;
      }
      message.success('操作成功',1,()=>{
        reloadTable();
      })
    }
   
    render() {
                
        var {
          dataSource=[], 
          pagination={current:1,total:1,pageSize:10},
          loading=true,
          toPage,
          reloadTable
        }=this.props;
        pagination.showQuickJumper = true;
        return (
            <div >
              <Table 
                bordered
                columns={this.getColumns()} 
                simple 
                dataSource={dataSource}
                pagination={pagination}
                loading={loading}
                onChange={toPage}
                scroll={{ x: 1000 }}
                rowKey={record => record.id}
              />
            </div>
        );
    }

    getColumns(){
      let {src} = this.props;
      let columns = [
            {
              title: '项目编号',
              dataIndex: 'id',
              key: 'id',
            },{
              title: '项目名称',
              dataIndex: 'title',
              key: 'title',
            }, {
              title: '筹款人姓名',
              dataIndex: 'borrower_name',
              key: 'borrower_name',
              
            },{
              title: '用户昵称',
              dataIndex: 'nick_name',
              key: 'nick_name',
              
            }, {
              title: '手机号码',
              dataIndex: 'borrower_phone',
              key: 'borrower_phone'
            },{
              title: '身份证号',
              dataIndex: 'borrower_id_card',
              key: 'borrower_id_card',
            }, {
              title: '筹款金额',
              dataIndex: 'amount',
              key: 'amount'
            },{
              title: '实际筹款金额',
              dataIndex: 'cur_amount',
              key: 'cur_amount'
            },{
              title: '还款时间',
              dataIndex: 'repayment_date',
              key: 'repayment_date'
            },{
              title: '申请时间',
              dataIndex: 'created_at',
              key: 'created_at'
            },{
              title: '审批状态',
              dataIndex: 'status',
              key: 'status',
              render:(text,record)=>{
                return RAISE_STATUS[text];
              }
            },{
              title: '操作',
              key: 'action',
              fixed: 'right',
              width:170,
              render: (record) =>{
                if(src=='approve'){
                  return (
                    <span>
                      <a 
                        href='javascript:void 0;'
                        onClick={()=>{
                            this.context.router.push('/loan/raise/approve/detail?id='+record.id);
                        }}
                      >查看</a>
                    </span>
                  )
                }
                return (
                  <div>
                    <span>
                      <a 
                        href='javascript:void 0;'
                        onClick={()=>{
                          this.context.router.push(`/loan/raise/detail?id=${record.id}&tab=loan`);
                        }}
                      >查看</a>
                      {/^(3|9|7|13|17)$/.test(record.status)?
                        <span className="ant-divider" />:null
                      }
                    </span>
                    <span>
                      {record.status==3?
                        <Popconfirm title="确定要终止项目?" onConfirm={this.stopLoan.bind(this,record)} >
                            <a 
                              href='javascript:void 0;'
                            >终止项目</a>
                        </Popconfirm>
                        :null
                      }
                      {record.status==9||record.status==7?
                        <Popconfirm title="确定放款?" onConfirm={this.confirmLoan.bind(this,record)} >
                            <a 
                              href='javascript:void 0;'
                            >确认放款</a>
                        </Popconfirm>
                        :null
                      }
                      {/* {record.status==11?
                        <Popconfirm title="确定放款?" onConfirm={this.stopLoan.bind(this,record)} >
                            <a 
                              href='javascript:void 0;'
                            >查看项目</a>
                        </Popconfirm>
                        :null
                      } */}
                      {record.status==13?
                        <Popconfirm title="确定提醒还款?" onConfirm={this.refundTips.bind(this,record)} >
                            <a 
                              href='javascript:void 0;'
                            >提醒还款</a>
                        </Popconfirm>
                        :null
                      }
                      {record.status==17?
                            <a 
                              href='javascript:void 0;'
                              onClick={() =>{
                                this.context.router.push(`/loan/raise/detail?id=${record.id}&tab=plan`);
                              }}
                            >还款分账</a>
                        :null
                      }
                    </span>
                    {/* <span>
                       <span className="ant-divider" />
                       <Popconfirm title={"确定"+(record.hide_flag==0?'隐藏项目':'开启项目')+'?'} onConfirm={this.hideLoan.bind(this,record)} >
                        <a 
                          href='javascript:void 0;'
                        >{record.hide_flag==0?'隐藏项目':'开启项目'}</a>
                      </Popconfirm>
                    </span> */}
                  </div>
                  
                )
              } ,
            }
        ];

        return columns
    }
}

RaiseLoanTable.contextTypes= { router: React.PropTypes.object.isRequired};

